<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>内训详情</title>
    <link rel="icon" href="favicon.ico" type="images/ico">
    <meta name="author" content="dc">
    <link rel="stylesheet" type="text/css" href="/css/materialdesignicons.min.css">
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="/css/style.min.css">
    <link href="/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/js/jquery-confirm/jquery-confirm.min.css"/>
    <link rel="stylesheet" href="/css/bootstrapValidator.min.css" />
    <!--时间选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css"/>
    <!--日期选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datepicker/bootstrap-datepicker3.min.css"/>
    <link rel="stylesheet" href="/css/skin.css"/>
    <link rel="stylesheet" type="text/css" href="/css/daterangepicker.css" />
    <!-- 多选下拉 -->
    <link rel="stylesheet" href="/css/bootstrap-multiselect.css" type="text/css"/>
    <link rel="stylesheet" href="/css/bootstrap-select.css" type="text/css"/>
    <link rel="stylesheet" href="/css/trainingManager/internalTrainingDetail.css"/>
</head>
<body>
<div class="container-fluid">
    <div class="card customer-card">
        <div class="card-header">
            <h1>内训详情</h1>
        </div>

        <div class="card-body" id="infoCard" >
            <div id="info">
                <div class="content-info">
                    <div class="customer-logo">
                        <div id="imageId0" class="hidden" th:text="${training?.uploadId}"></div>
                        <div class="logo">
                            <a href="!#" data-toggle="modal" data-target="#editHeadModal">
                                <img id="newsPic0" th:src="@{(${training?.accessUrl?:'/images/internal/icon-horse.png'})}" />
                                <label>
                                    <span class="img-span">修改</span>
                                </label>
                            </a>
                        </div>
                    </div>
                    <div class="customer-info">
                        <div class="title">
                            <h3 th:text="${training?.customerName}"></h3>
                            <!-- 判断是否有到期时间字段内容 -->
                            <span class="vip" th:if="${membershipExpirationTm} eq null"><strong th:text="${training?.membershipLevelText}"></strong></span>
                            <span class="vip" th:if="${membershipExpirationTm} ne null" data-toggle="tooltip" data-placement="top" th:data-original-title="'会员到期时间：' + ${#dates.format(training?.membershipExpirationTm, 'yyyy-MM-dd')}"><strong th:text="${training?.membershipLevelText}"></strong></span>
                            <div class="credit">（客户编码：<span th:text="${training?.customerNumber}"></span>）</div>
                            <div class="card-actions pull-right edit-background" >
                                <button class="btn btn-primary" id="editInfo" data-toggle="modal" data-target="#editInfoModal" onclick="showTrainingEditInfo()">编辑 <i class="mdi mdi-tune"></i></button>
                            </div>
                        </div>
                        <ul class="general" style="margin-top: 10px">
                            <li>
                                <span>内训所有人</span><p th:text="${training?.trainingChargeName}"></p>
                            </li>
                            <li>
                                <span>外训所有人</span><p th:text="${training?.userName}"></p>
                            </li>
                            <li>
                                <span>提供时间</span><p th:text= "${#dates.format(training?.createTm, 'yyyy-MM-dd')}"></p>
                            </li>
                            <li>
                                <span>返点设置</span><p th:text="${training?.rebateSetting}"></p>
                            </li>
                            <li>
                                <span>目前返点金额</span><p th:text="${training?.currentRebateAmount}"></p>
                            </li>
                            <li>
                                <span>当前状态</span><p th:text="${training?.currentStateText}"></p>
                            </li>
                        </ul>
                        <div class="tags clearfix" id="tagsBox"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="card">
        <ul class="nav nav-tabs tabs-lg" role="tablist">
            <li class="active"><a href="#companyInformation" aria-controls="" role="tab" data-toggle="tab" aria-expanded="true">内训需求表</a></li>
            <li class="" onclick="contactTableInit()"><a href="#contactList" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">联系人</a></li>
            <li class=""><a href="#communicationRecordList" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">沟通记录</a></li>
            <li class="" ><a href="#educationalAdministrationDemand" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">教务需求</a></li>
            <li class="" onclick="trainingContractAndOrderTableInit()"><a href="#contractAndOrderList" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">合同订单</a></li>
            <li class="" ><a href="#collectionManagement" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">回款管理（发票）</a></li>
            <li class="" ><a href="#projectImplementation" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">项目实施（风险）</a></li>
        </ul>
        <div class="tab-content">
            <!-- 内训需求表 -->
            <div role="tabpanel" id="companyInformation" class="tab-pane active">
                <span id="trainingId" class="hidden" th:text="${training?.trainingId}"></span>
                <span id="trainingDemandId" class="hidden"></span>
                <div class="row company-info">

                    <div class="col-xs-4 ">
                        <div class="">
                            <p>公司规模:<span id="company_size" class="content-bold"></span></p>
                            <p>需求负责人:<span id="demandLeader" class="content-bold"></span></p>
                        </div>
                    </div>
                    <div class="col-xs-4 ">
                        <div class="">
                            <p>公司财务人数:<span id="companyFinancialNumber" class="content-bold"></span></p>
                            <p>需求负责人联系方式:<span id="contactDetails" class="content-bold"></span></p>
                        </div>
                    </div>
                    <!--
                    <div class="col-xs-4 internal-btn">
                        <button class="btn btn-primary pull-right" data-toggle="modal" data-target="#internalTrainingModal" >编辑 <i class="mdi mdi-tune"></i></button>
                    </div>
                    -->
                </div>
                <div class="form-well" style="padding: 0">
                    <h3>需求项列表</h3>
                    <p>
                        <button type="button" class="btn btn-success btn-label pull-right" data-toggle="modal" style="margin-bottom: 20px;" onclick="addTrainingDemand();">
                        <label><i class="mdi mdi-plus"></i></label>添加需求</button>
                    </p>
                    <table id="trainingDemandItemTable" class="company-profile"></table>
                </div>
            </div>
            <!-- 联系人-->
            <div role="tabpanel" id="contactList" class="tab-pane">
              <p>
                   <button type="button" class="btn btn-success btn-label" onclick="showAddTrainingContactModal()">
                      <label><i class="mdi mdi-plus"></i></label>新增联系人</button>
               </p>
               <table id="contactTable"></table>
            </div>
            <!-- 沟通记录 -->
            <div role="tabpanel" id="communicationRecordList" class="tab-pane">

            </div>
            <!-- 教务需求 -->
            <div role="tabpanel" id="educationalAdministrationDemand" class="tab-pane">

            </div>
            <!-- 合同订单 -->
            <div role="tabpanel" id="contractAndOrderList" class="tab-pane">
                <table id="trainingContractAndOrderTable"></table>
            </div>
            <!--回款管理(发票)-->
            <div role="tabpanel" id="collectionManagement" class="tab-pane">

            </div>
            <!--项目实施(风险)-->
            <div role="tabpanel" id="projectImplementation" class="tab-pane">

            </div>
        </div>
    </div>
</div>
<!-- 编辑内训详情 -->
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" id="editInfoModal">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title" id="myModalLabel">修改信息</h4>
            </div>
            <div class="modal-body">
                <form id="editInfoForm" class="well form-well" autocomplete="off">
                    <div class="row">

                        <div class="col-xs-6">
                            <label class="control-label label-required" >内训所有人</label>
                            <div class="form-group">
                                <select id="training_charge_select" name="trainingChargeId" class="form-control" data-live-search="true">
                                    <option value="">请选择</option>
                                </select>
                            </div>
                        </div>

                        <div class="col-xs-6">
                            <label class="control-label label-required" >返点设置</label>
                            <div class="form-group">
                                <input type="text" name="rebateSetting" id="rebate-setting" class="form-control" placeholder="请输入返点设置">
                            </div>
                        </div>

                        <div class="col-xs-6">
                            <label class="control-label label-required" >目前返点金额</label>
                            <div class="form-group">
                                <input type="text" name="currentRebateAmount" id="current_rebate_amount" class="form-control" placeholder="请输入目前返回金额">
                            </div>
                        </div>

                        <div class="col-xs-6">
                            <label class="control-label label-required" >当前状态</label>
                            <div class="form-group">
                                <select id="current-state-select" name="currentStateSelect" class="form-control" data-live-search="true">
                                    <option value="">请选择</option>
                                    <option value="0">需求分析</option>
                                    <option value="1">方案报价</option>
                                    <option value="2">洽谈合同</option>
                                    <option value="3">赢单</option>
                                    <option value="4">输单</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="saveUpdateTraining();">保存</button>
            </div>
        </div>
    </div>
</div>
<!-- 增加需求项 -->
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" id="addTrainingDemandItemModal">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title">增加需求项</h4>
            </div>
            <div class="modal-body">
                <form id="addTrainingDemandItemForm" class="well form-well" autocomplete="off">
                    <div class="row">
                        <div class="col-xs-4">
                            <label class="control-label label-required">需求项名称</label>
                            <div class="form-group">
                                <input name="demandItemName" id="demandItemName" type="text" class="form-control" placeholder="请输入需求项名称">
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <label class="control-label label-required">需求内容</label>
                            <div class="form-group">
                                <textarea rows="8" name="demandContent" id="demandContent" class="form-control" maxlength="200"></textarea>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="saveTrainingDemandItem();">保存</button>
            </div>
        </div>
    </div>
</div>
<!-- 新增内训/添加内训需求 -->
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" id="internalTrainingModal">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title" id="internalTrainingTitle"></h4>
            </div>
            <div class="modal-body">
                <form id="internalTrainingForm" class="well form-well" autocomplete="off" style="padding: 10px 100px;">
                    <div class="row">
                        <div class="col-xs-6">
                            <label class="control-label label-required">公司规模</label>
                            <div class="form-group">
                                <input name="companySizeT" id="companySizeT" type="text" class="form-control" placeholder="请输入公司规模哦">
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label label-required">需求负责人</label>
                            <div class="form-group">
                                <input name="demandLeaderT" id="demandLeaderT" type="text" class="form-control" placeholder="请输入需求负责人">
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label label-required">公司财务人数</label>
                            <div class="form-group">
                                <input name="companyFinancialNumberT" id="companyFinancialNumberT" type="text" class="form-control" placeholder="请输入公司财务人数">
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label label-required">需求负责人联系方式</label>
                            <div class="form-group">
                                <input type="text" hidden="hidden" id="phone">
                                <input name="contactInformationT" id="contactInformationT" type="text" class="form-control" placeholder="请输入需求负责人联系方式">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="saveTraining();">保存</button>
            </div>
        </div>
    </div>
</div>

<!-- 新增联系人弹框 -->
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" id="addTrainingContactModal">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title">新增联系人</h4>
            </div>
            <div class="modal-body" style="min-height: 200px;">
                <form id="addTrainingContactForm" class="well form-well" autocomplete="off">
                    <div class="row">
                        <div class="col-xs-4">
                            <label class="control-label label-required">联系人姓名</label>
                            <div class="form-group">
                                <input name="contactNameAdd" id="contactNameAdd" type="text" class="form-control" placeholder="请输入联系人姓名">
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="control-label label-required">联系方式</label>
                            <div class="form-group">
                                <input name="contactInformationAdd" maxlength="20" id="contactInformationAdd" type="text" class="form-control"
                                       placeholder="请输入联系方式">
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="control-label">在职情况</label>
                            <div class="form-group">
                                <select class="form-control" id="onTheJobSituationAdd" name="onTheJobSituationAdd" type="text" title="请选择">
                                    <option value="0">在职</option>
                                    <option value="1">离职</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="control-label label-required">职务</label>
                            <div class="form-group">
                                <select name="contactPositionAdd" class="form-control" id="contactPositionAdd" type="text" title="请选择">
                                    <option value="0">公司管理</option>
                                    <option value="1">财务</option>
                                    <option value="2">人力</option>
                                    <option value="3">其他</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="control-label label-required">联系人类型</label>
                            <div class="form-group">
                                <select name="contactState" class="form-control" id="contactState" type="text" title="请选择">
                                    <option value="1">主联系人</option>
                                    <option value="2">从联系人</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="control-label">微信</label>
                            <div class="form-group">
                                <input name="wxAdd" type="text" id="wxAdd" class="form-control" placeholder="请输入微信">
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="control-label">邮箱</label>
                            <div class="form-group">
                                <input name="mailBoxAdd" id="mailBoxAdd" type="text" class="form-control"
                                       placeholder="请输入邮箱">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="saveTrainingContact();">保存</button>
            </div>
        </div>
    </div>
</div>

<!-- 修改联系人弹框 -->
<div class="modal fade" tabindex="-1" role="dialog" id="editTrainingContactModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title">修改联系人</h4>
            </div>
            <div class="modal-body">
                <form id="editTrainingContactForm" class="well form-well" autocomplete="off">
                    <div class="row">
                        <div class="col-xs-6">
                            <label class="control-label">联系人姓名</label>
                            <div class="form-group">
                                <input id="contactNameEdit" name="contactNameEdit" type="text" class="form-control" disabled="disabled">
                                <input id="trainingContactId" type="hidden">
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label">联系方式</label>
                            <div class="form-group">
                                <input maxlength="20" id="contactInformationEdit" name="contactInformationEdit" type="text" class="form-control" disabled="disabled">
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label">职务</label>
                            <div class="form-group">
                                <select name="contactPositionEdit" class="form-control" id="contactPositionEdit" type="text" title="请选择">
                                    <option value="0">公司管理</option>
                                    <option value="1">财务</option>
                                    <option value="2">人力</option>
                                    <option value="3">其他</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label">在职情况</label>
                            <div class="form-group">
                                <select name="onTheJobSituationEdit" class="form-control" id="onTheJobSituationEdit" type="text" title="请选择">
                                    <option value="0">在职</option>
                                    <option value="1">离职</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label">邮箱</label>
                            <div class="form-group">
                                <input name="mailBoxEdit" id="mailBoxEdit" type="text" class="form-control">
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <label class="control-label">微信</label>
                            <div class="form-group">
                                <input name="wxEdit" id="wxEdit" type="text" class="form-control">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="updateTrainingContact();">确定</button>
            </div>
        </div>
    </div>
</div>

<!-- 修改头像 -->
<div class="modal fade" id="editHeadModal" tabindex="-1" role="dialog" aria-labelledby="editHeadModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="topEdit">
                <span id="customerId" class="hidden" th:text="${training?.customerId}"></span>

                <div class="form-content">
                    <div class="file-group">
                        <input type="file" accept=".png,.jpg,.jpeg,.bmp,.gif" id="customerPic1" class="hidden" />
                        <div class="img-box" id="customerImgBox"><img id="newsPic" th:src="@{(${training?.accessUrl?:'/images/internal/icon-horse.png'})}" /></div>
                        <button class="btn btn-default file-browser" type="button" style="display: block; margin: 0 auto 24px;">上传Logo</button>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary"  onclick="editCustomerImgHead()">保存</button>
            </div>
        </div>
    </div>
</div>
</body>

<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/bootstrapValidator.min.js"></script>
<script type="text/javascript" src="/js/perfect-scrollbar.min.js"></script>
<!--标签插件-->
<script src="/js/jquery-tags-input/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="/js/main.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="/js/popper.min.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.min.js"></script>
<script src="/js/jquery-confirm/jquery-confirm.min.js"></script>
<script src="/js/crm/common/city.js"></script>
<script src="/js/crm/common/common.js"></script>
<!--时间选择插件-->
<script src="/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<!--标签插件-->
<script type="text/javascript" src="/js/bootstrap-tagsinput/bootstrap-tagsinput.js"></script>
<!--消息提醒-->
<script type="text/javascript" src="/js/bootstrap-notify.min.js"></script>
<script type="text/javascript" src="/js/crm/common/lightyear.js"></script>
<!--时间选择插件-->
<script src="/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<script type="text/javascript" src="/js/crm/common/dataRangePicker.min.js"></script>
<!-- 评分插件 -->
<script type="text/javascript" src="/js/crm/common/raty.js"></script>
<!--日期选择插件-->
<script src="/js/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script src="/js/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<!-- 多选框下拉 -->
<script type="text/javascript" src="/js/bootstrap-select.js"></script>
<script type="text/javascript" src="/js/bootstrap.lyear.dropdowntree.min.js"></script>
<!--公司、人员下拉JS-->
<script src="/js/crm/common/companyUserSelect.js"></script>
<!--自定义JS-->
<script src="/js/crm/trainingManager/internalTrainingDetail.js"></script>
</html>